<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>JpetStore</title>
    <link rel="stylesheet" href="../css/jpetstore.css" type="text/css"/>
    <link rel="stylesheet" href="../css/jquery-ui.css" type="text/css"/>
    <script th:src = "@{/JS/jquery-3.2.1.js}"></script>
    <script th:src = "@{/JS/jquery-ui.js}"></script>
</head>
<body>
<div th:replace="/common/header.html"></div>
<div id="Content">
    <div id="Catalog">
        <a href="/catalog/main">Return to Menu</a>

        <p>请输入注册邮箱和验证码.</p>
        <p>Are you a administrator?<a href="/catalog/AdminSignonForm">Click Here!</a></p>
        <br/>
        <form method="post" action="/account/signOnByEmail" id="signOnForm">
            <label class = "signOnTitle" for="email">email: </label><input type="email" name="email" id="email"class="signOnText" required="required">
            <br/>
            <br>
            <button type="button" id="code" class = "signOnTitle" onclick="getemail()">获取邮箱验证码: </button><input type="text" name="textCode" id="textCode"class="signOnText" required="required">
            <br/>
            <br/>
            <script type="text/javascript">

                var receiver = document.getElementById("email");
                var code = document.getElementById("code");

                function getemail(){

                    code.innerText="重新获取验证码";
                    console.info(receiver.value);
                    xhr = new XMLHttpRequest();
                    xhr.onreadystatechange = processEmail;
                    xhr.open("GET","/account/verCode?receiver=" + receiver.value,true);
                    xhr.send(null);
                }
                function processEmail(){
                    if(xhr.readyState == 4){
                        if(xhr.status == 200){
                            var str = xhr.responseText;
                            if(str == "error"){
                                alert("该邮箱还未被注册");
                            }else{
                                alert("邮箱已经发送");
                            }
                        }
                    }
                }

            </script>
            </br>
            <input type="submit" value="提交" id="signOnSubmit"/>
        </form>
        <a href="/account/signOnForm">切换到账户密码登录<a><br/>
        Need a user name and password? <a href="newAccountForm">Register Now!</a>


    </div>
</div>
<div th:replace="/common/footer.html"></div>
</body>
</html>